<template>
  <el-table
    highlight-current-row
    ref="multipleTable"
    :data="tableData"
    tooltip-effect="dark"
    style="width: 100%"
  >
    <!-- <el-table-column type="selection" width="55"></el-table-column> -->
    <el-table-column prop="name" type="index" label="序号" width="65"></el-table-column>
    <el-table-column prop="name" label="型号名称" width="120"></el-table-column>
    <el-table-column prop="model" label="型号编码"></el-table-column>
    <el-table-column prop="image" label="设备图片">
      <template #default="{row}">
        <div class="imgdiv">
          <img :src="row.image" alt />
        </div>
      </template>
    </el-table-column>
    <el-table-column prop="vmRow" label="货道行"></el-table-column>
    <el-table-column prop="vmCol" label="货道列"></el-table-column>
    <el-table-column prop="channelMaxCapacity" label="货道容量"></el-table-column>
    <el-table-column label="操作">
      <template #default="{ row }">
        <el-button type="text" @click="$emit('updataType', row)">修改</el-button>
        <el-button type="text" class="reddd" @click="deleteType">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import vm from '@/Enums/vm'
export default {
  name: 'EmperorKedeTypeBodytable',
  props: {
    tableData: {
      type: Array,
      default: () => [],
      required: true
    }
  },
  data () {
    return {}
  },

  mounted () {
    this.thisvmStatus = vm.thisvmStatus
  },

  methods: {
    formatterFn (row, column, cellValue, index) {
      //  console.log('cellValue'，cellValue) // 聘用形式
      // cellValue 0，1
      // You，1 second ago
      // [{id: 1，value:正式'}，[J]
      // 把拿到的数据进行遍历查找
      const info = this.thisvmStatus.find((item) => item.id === cellValue)
      // .find 返回的是 一个对象
      // 处理方法 判断 info 有没有数据  只有有数据 才渲染
      return (info && info.value) || '撤机'
    },
    //
    //
    deleteType () {
      this.$notify({
        title: '警告',
        message: '演示系统，不支持此操作',
        type: 'warning'
      })
    }
  }
}
</script>

<style lang="less" scoped>
.reddd {
  color: red;
}
.imgdiv {
  width: 24px;
  height: 24px;
  img {
    width: 100%;
  }
}
</style>
